Create.xyz: AI驱动的低代码平台,助力快速构建网页、集成 AI 工具、调用API
早在7月15日我介绍了这个工具,是我历史付费推文里含金量最高的一篇,推荐阅读。
搭配Claude Artifacts、Websim、Glif或今天介绍的Create,效率会更高。
引言
之前我介绍了Claude Artifacts、Websim、Glif,可以理解它们都是低代码平台。
今天,想向大家介绍一个令我兴奋的新工具—— Create.xyz。
Create.xyz简介
Create.xyz 是一个 AI 驱动应用开发平台。
主要特点:
自然语言生成代码:只需使用简单的文本描述或图像,Create.xyz 就能将其转化为代码并运行应用程序。
强大的集成功能:可以集成Claude、ChatGPT 和 GPT Vision 等强大的 AI 工具。
实时协作:内置实时协作功能,方便团队成员共同编辑和开发项目。
REST API 集成
上传 Swagger 文档,自动连接 UI 和 API 支持各种 API:生产环境、Airtable、Supabase、Xano 等
丰富的组件库
包含表格、网格、列表、卡片、地图、搜索、过滤等组件 支持 React 库(如 Chakra 或 Shadcn) 可构建自定义组件库
Create.xyz有免费体验次数。
我喜欢它有丰富的案例和对应的提示词。
它支持下载完整代码。
下图是我参考Create的示例里的提示词用Claude生成的。
原设计
参考后生成效果
Create.xyz 的应用场景
创业公司快速原型开发:创业者可以在几分钟内创建一个功能性的 MVP(最小可行产品),用于向潜在投资者展示或进行市场测试。 企业内部工具开发:大型企业经常需要各种定制化的内部工具。使用 Create.xyz,即使是非技术部门的员工也能快速创建他们需要的应用,大大提高工作效率。 教育领域的互动学习平台:教育工作者可以使用 Create.xyz 快速构建互动性强的学习平台,让学生通过实践来理解复杂的概念。 个人项目和副业:对于那些有创意但缺乏编程技能的个人来说,Create.xyz 提供了一个将想法变为现实的平台,无论是博客、作品集网站,还是小型电商平台。 活动和会议管理系统:组织者可以使用 Create.xyz 快速搭建活动报名、日程安排、参会者交流等功能的综合平台。
Create.xyz 的功能与集成
1. 利用 AI 快速构建网页
在这个视频中,可以看到如何使用 Create.xyz 快速构建一个网页。以下是具体的操作步骤:
创建项目:
在 Create.xyz 的 Prompt 标签页的文本框中输入提示语:"build me a sick landing page for my web development agency using the latest design trends from 2024"。 点击 "Generate" 按钮。
预览和修改:
预览 AI 生成的网页布局和内容。 如需修改,可以在 Prompt 文本框中添加新的要求,例如:"make the color scheme black background with yellow and orange highlights"。 再次点击 "Generate" 按钮重新生成网页。
查看和下载代码:
点击 "View code" 按钮查看生成的网页代码。 点击 "Download" 按钮下载代码到本地。
本地运行:
在终端中移动下载的文件: mv .../Downloads/createxyz-project ./
进入项目目录: cd createxyz-project
安装依赖包: npm install
启动本地服务器: npm run dev
2. AI 工具的嵌入与应用
在这个视频中,我们可以看到如何使用 Create.xyz 创建一个 AI 图像生成器,并将其嵌入到 Notion 页面中。
以下是具体的操作步骤:
创建 AI 图像生成器:
在 Create.xyz 编辑器中,输入提示:“Build a webpage that takes user input and uses it to generate an image with /Stable Diffusion V3”。 点击 “Generate” 按钮,Create.xyz 会生成相应的代码。 点击 “Share” 按钮,然后复制生成的 iframe 代码。
嵌入到 Notion 页面:
在 Notion 页面中,输入 “/” 并选择 “Embed” 选项。 粘贴刚才复制的 iframe 代码,然后点击 “Embed link” 按钮。
就这样,一个功能强大的 AI 图像生成器就被成功嵌入到了 Notion 页面中。用户可以直接在 Notion 页面上输入描述(如 “fox eating a banana”),然后点击 “Generate image” 按钮,即可看到 AI 生成的图像。
3. 调用外部 API 创建动态内容
Create.xyz 的强大之处还在于它能够轻松地调用外部 API,从而创建动态更新的内容。
获取维基百科 API 密钥:首先需要创建维基百科账户,申请 API 密钥。
在 Create.xyz 中创建功能:
在 Create.xyz 编辑器中,从维基百科 API 文档中复制粘贴相关代码。 添加额外指令以确保代码格式正确。
创建 UI:
选择组件库(如 shadcn/ui)。 添加页面布局信息。 使用 Stable Diffusion 生成图片。 使用 ChatGPT 生成文章摘要。 添加页脚和日期切换按钮。
最终的结果是一个功能完备的网页,可以展示维基百科每日特色文章的标题、日期、图片和摘要,用户还可以通过按钮切换不同日期的文章。
类似的方法可以用来创建各种实时数据展示页面,如天气预报、股票行情、新闻聚合等。
4. 集成第三方工具扩展功能
这个视频展示了如何创建一个生日派对 RSVP(邀请函回复)网页应用,并将用户提交的信息自动添加到 Google Sheet 中。
以下是主要步骤:
创建网页应用:
在 Create.xyz 编辑器中,使用提示生成一个包含活动信息、地图和 RSVP 表格的网页。 应用使用了 shadcn/ui 组件库和 Google Maps 集成。
设置 Zapier 集成:
在 Create.xyz 中创建一个用于发送数据的函数。 将 Zapier webhook URL 添加到该函数中。
配置 Zapier:
在 Zapier 中设置触发器(Catch Hook in Webhooks by Zapier)。 设置动作(Create Spreadsheet Row in Google Sheets)。 配置数据映射关系,确保 RSVP 信息正确添加到 Google Sheet 的相应列中。
测试功能:
在网页应用中填写并提交 RSVP 表格。 检查 Google Sheet,确认信息已成功添加。
这种集成能力使得 Create.xyz 不仅可以创建独立的应用,还可以成为更大型、更复杂系统中的重要组成部分。
5. 使用提示生成器构建 SaaS 网站
Create.xyz 还提供了强大的提示生成器,帮助用户更精确地描述他们想要创建的内容。
这个视频展示了如何使用 Create.xyz 的提示生成器来构建 SaaS 网站着陆页面。以下是主要步骤:
在 Create.xyz 的提示生成器界面输入简单描述,如 "A landing page for my B2B SaaS company"。
提示生成器会创建一个详细的提示,包含页面结构、功能、代码片段等。
复制生成的详细提示。
在 Create.xyz 编辑器中创建新项目,粘贴刚才复制的提示。
点击 "Generate" 按钮,Create.xyz 会根据提示生成完整的 SaaS 网站着陆页面。
结语
读到这里的你,是否迫不及待想要尝试 Create.xyz 了呢?
不妨现在就去https://create.xyz注册一个账号,开启你的 AI 辅助开发之旅吧!
记住,在这个平台上,唯一的限制就是你的想象力。
广告时间
过去我已写了160+篇AI主题原创长文,我对继续写作充满信心,因为这是我的爱好,我非常热爱这件事。
最近我开通了知识星球,你加入后可以访问公众号收费文章,向我提问,第一时间获取AI资讯。
精选历史文章,请看这里:
解锁 Claude 3.5 Sonnet 创意潜能:10+ 个 Web 应用实战